<template>
  <div class="app-container">
    <el-table
      class="el-table-align-center"
      :data="tableData"
      border
      v-loading="loading">
      <el-table-column label="绑定时间">
        <template slot-scope="{row}">
          {{row.createDate | toTime }}
        </template>
      </el-table-column>
      <el-table-column label="银行名称" prop="bankName">
      </el-table-column>
      <el-table-column label="持卡人姓名" prop="name">
      </el-table-column>
      <el-table-column label="卡号" prop="cardNo">
      </el-table-column>
      <el-table-column label="分行地址" prop="address">
      </el-table-column>
      <el-table-column label="状态" prop="status">
        <template slot-scope="{row}">
          {{ row.status | toConverter('USER_BANK_STATUS')}}
        </template>
      </el-table-column>
      <el-table-column label="删除时间">
        <template slot-scope="{row}">
          <span v-if="row.status === 1">
          {{row.lastUpdate | toTime }}
          </span>
          <span v-else>---</span>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
  import {getMemberBankLogs} from "@/services/api/member";
  import {grid} from '@/build'


  export default {
    name: "user-bank-logs",
    mixins: [grid],
    data() {
      return {
        tableData: [],
        filters: {
          userId: this.$store.state.member.member_id,
        },
        filterDateType: false,
      }
    },
    methods: {},

    mounted() {
      this.bindGet(getMemberBankLogs, 'tableData', {
        sendingData: 'filters'
      })
      this.getAll()
    }
  }
</script>

<style lang="scss" scoped>
  .el-card-header {
    padding-bottom: 20px;
    .total-wrap {
      padding: 5px;
      line-height: 2;
      strong {
        display: inline-block;
        text-align: right;
        width: 100px;
        font-size: 14px;
      }
      .total-item {
        font-size: 14px;
        padding: 0 5px;
        display: inline-block;
        min-width: 120px;
      }
    }
  }
</style>
